<script setup lang="ts">
import { useCommonStore } from '@/stores'

const props = defineProps({
  centerTable: {
    default: null,
    type: Array
  },
  loading: {
    default: false,
    type: Boolean
  }
})

const commonStore = useCommonStore()
const emit = defineEmits({})

const centerSeeRow = (row: any) => {
  emit('centerSeeRow', row)
}
</script>

<template>
  <div class="mainTable-page">
    <el-button
      type="primary"
      @click="commonStore.dialogVisibleCommonChangeShow(true)"
      >+ &nbsp;&nbsp;添加</el-button
    >
    <el-table
      v-loading="loading"
      :data="props.centerTable"
      style="width: 100%; margin-top: 1%"
      :border="true"
    >
      <el-table-column align="center" label="序号" type="index" width="55" />
      <el-table-column
        align="center"
        label="中心名称"
        prop="title"
      ></el-table-column>
      <el-table-column
        align="center"
        label="地址"
        prop="address"
      ></el-table-column>
      <el-table-column
        align="center"
        label="负责人 "
        width="80"
        prop="name"
      ></el-table-column>
      <el-table-column
        align="center"
        label="联系方式"
        width="160"
        prop="phone"
      ></el-table-column>
      <el-table-column
        align="center"
        width="80"
        label="中心人数"
        prop="number"
      ></el-table-column>
      <el-table-column
        align="center"
        width="80"
        label="装备数量"
        prop="equipment"
      ></el-table-column>
      <el-table-column align="center" label="操作" width="120">
        <template #default="{ row }">
          <el-button link type="primary" @click="centerSeeRow(row)"
            >查看</el-button
          >
        </template>
      </el-table-column>
      <template #empty>
        <el-empty description="唉哟~~没有数据额~~" />
      </template>
    </el-table>
  </div>
</template>

<style lang="scss" scoped>
.cardHeader {
  padding: 3px 12px;
}
</style>
